<template>
  <!-- 直播组件：点击跳转到对应的直播房间 -->
  <div
    class="small-pdLiving-copy"
    :style="{padding:tplItemData.modulePadding + 'px ' + tplItemData.levelPadding + 'px'}"
  >
    <section class="pdLiving-box">
      <ul>
        <a
          v-for="(item,index) in tplItemData.dataset"
          href="javascript:;"
          :key="index"
          class="bdbox"
          @click="navToLiver(item)"
        >
          <!-- <wx-navigator :url="'plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=' + item.roomId">
                    <img :src="item.pic" />
          </wx-navigator>-->
          <img :src="item.pic" />
        </a>
      </ul>
    </section>
  </div>
</template>

<script>
import Vue from "vue";
import { openPage } from "@/utils/utils";
export default Vue.extend({
  name: "index",
  props: {
    tplItemData: {
      type: Object,
      default() {
        return {};
      }
    }
  },
  data() {
    return {};
  },
  mounted() {
    // console.log(this.tplItemData, "小程序直播");
  },
  methods: {
    navToLiver(item) {
      wx.navigateTo({
        url:
          "plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=" +
          item.roomId
      });
    }
  }
});
</script>

<style lang="scss">
.small-pdLiving {
  .pdLiving-box {
    overflow: hidden;
    ul {
      a {
        display: block;
        float: left;
        width: 100%;
        margin-right: 20px;
        overflow-x: hidden;
        img {
          width: 100%;
          height: auto;
        }
        &:last-child {
          margin-right: 0;
        }
      }
    }
  }
}
</style>